<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
      xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>查看流程</title>
    <link th:replace="common/header"/>
</head>
<body class="no-skin" style="overflow: hidden;">
<div th:replace="common/top"/>
<div class="main-container ace-save-state" id="main-container">
    <div th:replace="common/menu"/>
    <div class="main-content">
        <div class="main-content-inner">
            <div th:replace="common/title"/>
            <div class="page-content">
                <div th:replace="common/skin"/>
                <div class="row">
                    <input id="instanceId"  hidden th:value="${instanceId}">
                    <div class="col-xs-12">
                        <!-- PAGE CONTENT BEGINS -->
                        <h3 class="header smaller lighter blue"><i class="fa fa-server" aria-hidden="true"></i>添加流程
                        </h3>
                        <div class="row-fluid">
                            <div class="text-center span12">
                                <a class="btn" shiro:hasPermission="/activiti/getAll" href="getAll"
                                   th:href="@{/activiti/getAll}"><i class="fa fa-reply" aria-hidden="true"></i>返回</a>
                            </div>
                        </div>
                        <div class="row-fluid" id="iframe_div">
                            <div class="span12">
                                <iframe src="http://localhost:9013" id="frame" width="100%" height="800px"></iframe>
                            </div>
                        </div>
                        <!-- PAGE CONTENT ENDS -->
                    </div><!-- /.col -->
                </div><!-- /.row -->
            </div><!-- /.page-content -->
        </div>
    </div><!-- /.main-content -->
    <div th:replace="common/footer"/>
</div><!-- /.main-container -->
<div th:replace="common/buttom"/>
<script type="text/javascript">
    $(document).ready(function(){
        changeFrameHeight();

        $(window).resize(function(){
            changeFrameHeight();
        }).resize();
    });

    function changeFrameHeight(){
        var iframes = $('#frame');
        var contentContainer = $('#iframe_div'); // 获取tab标签对应的页面div容器对象 // 可能会出现获取不到的情况
        if (contentContainer.offset()) {
            offsetTop = contentContainer.offset().top;  //容器距离document顶部的距离
        }
        $.each(iframes, function(index, iframe){
            var h = window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight;
            iframe.height = h - offsetTop - 100; // 这里 offsetTop可以替换成一个比较合理的常量值
        });
    }
</script>
</body>
</html>
